<template>
  <Dialog v-model="dialogVisible" title="拒绝异议" width="600px">
    <el-form
      ref="formRef"
      :model="formData"
      :rules="formRules"
      label-width="100px"
      v-loading="formLoading"
    >
      <el-form-item label="异议编号">
        <el-input v-model="objectionInfo.objectionNumber" disabled />
      </el-form-item>
      
      <el-form-item label="异议类型">
        <el-input v-model="objectionInfo.objectionType" disabled />
      </el-form-item>
      
      <el-form-item label="异议原因">
        <el-input
          v-model="objectionInfo.objectionReason"
          type="textarea"
          :rows="3"
          disabled
        />
      </el-form-item>
      
      <el-form-item label="拒绝原因" prop="rejectReason">
        <el-select
          v-model="formData.rejectReason"
          placeholder="请选择拒绝原因"
          style="width: 100%"
        >
          <el-option label="证据不足" value="证据不足" />
          <el-option label="超出受理范围" value="超出受理范围" />
          <el-option label="重复申请" value="重复申请" />
          <el-option label="不符合受理条件" value="不符合受理条件" />
          <el-option label="其他" value="其他" />
        </el-select>
      </el-form-item>
      
      <el-form-item label="详细说明" prop="rejectComments">
        <el-input
          v-model="formData.rejectComments"
          type="textarea"
          :rows="4"
          placeholder="请详细说明拒绝原因"
        />
      </el-form-item>
      
      <el-form-item label="处理建议">
        <el-input
          v-model="formData.suggestions"
          type="textarea"
          :rows="3"
          placeholder="请输入处理建议（可选）"
        />
      </el-form-item>
    </el-form>
    
    <template #footer>
      <el-button @click="submitForm" type="danger" :disabled="formLoading">确认拒绝</el-button>
      <el-button @click="dialogVisible = false">取 消</el-button>
    </template>
  </Dialog>
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'

defineOptions({ name: 'ObjectionReject' })

const emit = defineEmits(['success'])

const dialogVisible = ref(false)
const formLoading = ref(false)
const formRef = ref()

const objectionInfo = reactive({
  id: undefined,
  objectionNumber: '',
  objectionType: '',
  objectionReason: ''
})

const formData = reactive({
  rejectReason: '',
  rejectComments: '',
  suggestions: ''
})

const formRules = reactive({
  rejectReason: [{ required: true, message: '请选择拒绝原因', trigger: 'change' }],
  rejectComments: [{ required: true, message: '请输入详细说明', trigger: 'blur' }]
})

/** 打开弹窗 */
const open = async (objection: any) => {
  dialogVisible.value = true
  Object.assign(objectionInfo, objection)
  resetForm()
}

/** 重置表单 */
const resetForm = () => {
  formData.rejectReason = ''
  formData.rejectComments = ''
  formData.suggestions = ''
  formRef.value?.resetFields()
}

/** 提交表单 */
const submitForm = async () => {
  if (!formRef.value) return
  
  const valid = await formRef.value.validate()
  if (!valid) return
  
  try {
    await ElMessageBox.confirm('确认拒绝此异议吗？拒绝后将无法撤销。', '确认拒绝', {
      type: 'warning'
    })
    
    formLoading.value = true
    
    const rejectData = {
      id: objectionInfo.id,
      handleResult: '已拒绝',
      handleComments: `拒绝原因：${formData.rejectReason}\n详细说明：${formData.rejectComments}${formData.suggestions ? '\n处理建议：' + formData.suggestions : ''}`,
      objectionStatus: 3 // 已拒绝
    }
    
    // TODO: 调用拒绝异议的API
    // await rejectObjection(rejectData)
    
    ElMessage.success('异议拒绝成功')
    dialogVisible.value = false
    emit('success')
  } catch (error) {
    if (error !== 'cancel') {
      console.error('拒绝异议失败:', error)
      ElMessage.error('拒绝异议失败')
    }
  } finally {
    formLoading.value = false
  }
}

defineExpose({ open })
</script>

<style scoped>
.el-form-item {
  margin-bottom: 20px;
}
</style>
